<!--
 * @Author: 李兵 964368540@qq.com
 * @Date: 2024-05-25 10:35:49
 * @LastEditors: libing 964368540@qq.com
 * @LastEditTime: 2024-06-27 16:01:09
 * @FilePath: \crm\components\select-picker\select-picker.vue
 * @Description: 下拉组件
-->
<template>
  <view class="picker-container">
    <picker @change="bindPickerChange" :range="range" range-key="label">
      <view class="picker-content">
        <view style="flex: 1">
          <slot />
        </view>

        <uni-icons
          type="right"
          size="20"
          class="right-arrow"
          color="#171A1D"
          v-if="!value"
        ></uni-icons>
      </view>
    </picker>
  </view>
</template>
<script>
export default {
  name: "select-picker",
  props: {
    range: {
      type: Array,
      default: () => [],
    },
    value: {
      type: [String, Number, Object, Array],
    },
  },
  methods: {
    bindPickerChange(e) {
      const val = e.detail.value;
      this.$emit("input", this.range[val].value);
    },
  },
};
</script>
<style scoped lang="scss">
.picker-content {
  display: flex;
  align-items: center;
}
</style>
